<template>
	<view class="searchPage">
		<div classs="searchTitle">
			<input class="search" type="text" placeholder="搜索" v-model="content">
			<button class="searchButton" @click="Search()">搜索</button>
		</div>
		<view style="clear: both;"></view>
		
		<div class="BlogItem" v-for="BlogData in Blogs" key=BlogData.id>
			
			<image @click="toBlogs(BlogData)" class="itemImage" :src="BlogData.images" ></image>
			<p class="itemContent" v-html="BlogData.title"></p>
			<image class="head" :src="BlogData.icon" ></image>
			<p class="blogUserName">{{BlogData.name}}</p>
			
			<view @click="Like(BlogData.goodsId)" class="likeImage">
				<image v-if="BlogData.isLike == false" class="like" src="../../imgs/6.png"></image>
				<image v-if="BlogData.isLike == true" class="like" src="../../imgs/61.png"></image>
				<p>{{BlogData.liked}}</p>
			</view>
		</div>
		
		<div class="Item" v-for="itemData in Goods" key=itemData.id>
			<image @click="ToGood(itemData.id)" class="itemImage" :src="itemData.images" ></image>
			<p class="itemContent" v-html="itemData.name"></p>
			<p class="itemMoney">${{itemData.price}}</p>
		</div>
		
	</view>
</template>

<script>
	var Goods = null
	var Blogs = null
	export default{
		name:'searchPage',
		components:{
			
		},
		data(){
			return{
				content:"",
				item:"",
				Goods:Goods,
				Blogs:Blogs
			}
		},
		onLoad:function(){

		},
		methods:{
			Search(){
				if(getApp().globalData.SearchClass == '1'){
					console.log("搜索博客")
					getApp().globalData.cache = null
					uni.request({
						url:"http://" + getApp().globalData.IpAddr + "/blog/query/blogOrGoods/1?content=" + this.content,
						method:"GET",
						header:{	'authorization':getApp().globalData.token	},
						success:res=>{
							if (res.data.success) {
								getApp().globalData.cache = res.data.data
								this.Blogs = getApp().globalData.cache
								console.log(getApp().globalData.cache)
								// console.log(res)
							}
							else wx.showToast({	title: '请求发送失败',	duration: 2000	})
						}
					})
					
				}else{
					console.log("搜索商品")
					getApp().globalData.cache = null
					uni.request({
						url:"http://" + getApp().globalData.IpAddr + "/goods/query/GoodsByContent/1?content=" + this.content,
						method:"GET",
						header:{	'authorization':getApp().globalData.token	},
						success:res=>{
							if (res.data.success) {
								getApp().globalData.cache = res.data.data
								this.Goods = getApp().globalData.cache
								console.log(getApp().globalData.cache)
								// console.log(res)
							}
							else wx.showToast({	title: '请求发送失败',	duration: 2000	})
						}
					})
					
				}
			},
			Like(id){
				uni.request({
					url:"http://" + getApp().globalData.IpAddr + "/blog/like/" + id,
					method:"PUT",
					header:{	'authorization':getApp().globalData.token	},
					success:res=> {
						if(res.data.success) wx.showToast({	title: '点赞成功',	duration: 2000	})
						else wx.showToast({	title: '点赞失败',	duration: 2000	})
					}
				})
			},
			toBlogs(BlogData){
				getApp().globalData.goodsId = BlogData.goodsId
				getApp().globalData.NowBlogId = BlogData.id
				uni.navigateTo({	url:"/pages/ext/BlogContent"	})
			},
			ToGood(id){
				getApp().globalData.goodsId = id;
				uni.request({
					url: "http://" + getApp().globalData.IpAddr + "/goods/" + getApp().globalData.goodsId,
					method:"GET",
					header:{	'authorization':getApp().globalData.token	},
					success:res=> {
						getApp().globalData.NowGood = res.data.data
						// console.log(res)
						uni.navigateTo({	url: "/pages/ext/commodity"	})
						}
				})
				
			}
		}
	}
</script>

<style>
	em{
		font-style: normal;
		color: red;
	}
	.Item{
		width: 40vw;
		height: 50vw;
		padding: 5vw;
		float: left;
	}
	.itemImage{
		width: 100%;
		height: 40vw;
	}
	.itemContent{
		text-align: center;
		max-width: 45vw;
		-webkit-line-clamp: 2;
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
	}
	.itemMoney{
		text-align: left;
		margin-top: 3vw;
	}
	.like{
		display: block;
		width: 5vw;
		height: 5vw;
		float: right;
		margin-top: 4vw;
	}
	.likeImage{
		font-size: 0.2vw;
		padding-right: 2vw;
		display: block;
		float: right;
	}
	.head{
		width: 7vw;
		height: 7vw;
		margin-top: 3vw;
		float: left;
	}
	.blogUserName{
		float: left;
		max-width: 15vw;
		white-space: nowrap;
		overflow: hidden;
		margin-top: 5vw;
		font-size: 10px;
	}
	.BlogItem{
		width: 35vw;
		height: 60vw;
		padding: 5vw;
		float: left;
	}
	.itemImage{
		width: 100%;
		height: 40vw;
	}
	.itemContent{
		text-align: center;
		max-width: 45vw;
		-webkit-line-clamp: 2;
		
	}
	.recommendTitle{
		text-align: center;
		display: block;
		margin-top: 50vw;
		margin-bottom: 5vw;
	}
	.searchPage{
		padding: 5vw;
	}
	.Item{
		width: 35vw;
		height: 50vw;
		padding: 5vw;
		float: left;
	}
	.itemImage{
		width: 100%;
		height: 35vw;
	}
	.itemContent{
		text-align: center;
		max-width: 45vw;
		-webkit-line-clamp: 2;
		
	}
	.itemMoney{
		text-align: left;
		margin-top: 3vw;
	}
	.searchTitle{
		display: block;
		float: left;
		width: 70vw;
		height: 28px;
		line-height: 28px;
		padding-left: 30px;
		
	}
	.search{
		display: block;
		border :1px solid #e6e6e6;
		border-radius: 20px;
		background-color: #ffffff;
		width: 60vw;
		float: left;
		padding: 5px;
		padding-left: 5vw;
	}
	.searchButton{
		width: 10vw;
		padding: 0px;
		margin-left: 5vw;
		float: left;
		font-size: 3vw;
		border-radius: 15px;
		background-color: #ff8080;
	}
</style>